module MC {
    export module msg {
        export function show(txt: string) {
            var wrap = document.createElement('div');
            $(wrap).css({
                'position': 'fixed',
                'top': '50%',
                'left': '50%',
                'transform': 'translate(-50%,-50%)',
                '-webkit-transform': 'translate(-50%,-50%)',
                'max-width': '50%',
                'padding': '.2rem .4rem',
                'color': 'white',
                'z-index': '20',
                'background': 'rgba(0,0,0,0.7)',
                'border-radius': '.08rem',
                'display': 'none',
                'font-size': '14px'
            });
            $(wrap).html(txt);
            $('body').append($(wrap));
            $(wrap).fadeIn();
            setTimeout(function () {
                $(wrap).fadeOut(function () {
                    $(wrap).remove();
                });
            }, 1500);
        }

        export function alert(text: string, fun: Function = null) {
            let html = $(` 
			<div class="msgbody"> 
			<div class="msgbodyDiv"></div>
			<div class="msgBox">
				<div class="boxcon">` + text + `</div>
				<div class="butarray clearfix"> 
					<a class="button closebtn buttonputong">关闭</a>
				</div>
			</div></div>`);
            html.find('.closebtn').click(() => {
                html.remove();
                fun && fun();
            });
            $('body').append(html);

            let isclick = false;
            html.find('.msgbodyDiv').on('click touchstart', () => {
                if (isclick) {
                    return;
                }
                isclick = true;
                let i = 1;
                html.find('.msgBox').addClass('on');
                let time = setInterval(() => {
                    if (i % 2 == 0) {
                        html.find('.msgBox').addClass('on');
                        ///	console.log('addClass',i);
                    } else {
                        html.find('.msgBox').removeClass('on');
                        ///console.log('removeClass',i);
                    }
                    i++;
                    if (i > 5) {
                        html.find('.msgBox').removeClass('on');
                        clearInterval(time);
                        isclick = false;
                    }
                }, 150);
            });
        }

        /**
         * 显示登录层
         * */
        export function ShowLogin(fun:Function) {
            let html = $(` 
			<div class="msgbody ShowLogin"> 
			<div class="msgbodyDiv"></div>
			<div class="msgBox">
				<div class="boxcon">
				<div class="toph">
				    <h4>欢迎来到</h4>
				    <h2>美策科技</h2>
                </div>
				<input type="text" id="phone" placeholder="手机号码"/>
				<input type="password" id="password" placeholder="密码"/>
				<button type="button" class="mui-btn mui-btn-primary loginbtn">登录</button>
				<div class="divpass">
					<a class="getCode" href="/h5/login/loginPwd.html">忘记密码</a>
					<a class="reg getCode" href="/h5/regist.html">注册账号</a>
				</div>
				
				</div>
				 
			</div></div>`);

            $('body').append(html);
            html.find('.loginbtn').on("click",()=>{
                let phone=html.find('#phone').val();
                let password=html.find('#password').val();
                fun(phone,password,()=>{

                    html.remove();
                });
            });

            let isclick = false;
            html.find('.msgbodyDiv').on('click touchstart', () => {
                if (isclick) {
                    return;
                }
                isclick = true;
                let i = 1;
                html.find('.msgBox').addClass('on');
                let time = setInterval(() => {
                    if (i % 2 == 0) {
                        html.find('.msgBox').addClass('on');
                        ///	console.log('addClass',i);
                    } else {
                        html.find('.msgBox').removeClass('on');
                        ///console.log('removeClass',i);
                    }
                    i++;
                    if (i > 5) {
                        html.find('.msgBox').removeClass('on');
                        clearInterval(time);
                        isclick = false;
                    }
                }, 150);
            });
        }

        /*** 带有确认按钮的消息框 */
        export function confirm(text: string, fun: Function) {
            let html = $(` 
			<div class="msgbody"> 
			<div class="msgBox">
				<div class="boxcon">` + text + `</div>
				<div class="butarray clearfix">
					<a class="button savebtn">确定</a>
					<a class="button closebtn buttonputong">关闭</a>
				</div>
			</div></div>`);
            html.find('.savebtn').click(() => {
                fun();
                html.remove();
            });
            html.find('.closebtn').click(() => {
                html.remove();
            });
            $('body').append(html);
        }


        /*** 显示用户资料卡 */
        export function showZiliao(id: string) {

            MC.msg.showLoad();
            MC.API.getInfo(id, (json: any) => {
                //	  console.log(json);
                MC.msg.hideLoad();
                let fun = '';
                /** <a class="gongsiIco fico"></a>
                 <a class="gongchangIco fico"></a>
                 <a class="jianliIco fico"></a> */
                if (json.is_company == 1) {
                    fun += '<a class="gongsiIco fico" href="/h5/index/comShow.html?uid=' + json.id + '"></a>';
                }
                if (json.is_factory == 1) {
                    fun += '<a class="gongchangIco fico" href="/h5/index/facShow.html?uid=' + json.id + '"></a>';
                }
                if (json.is_yingpin == 1) {
                    fun += '<a class="jianliIco fico" href="/h5/index/staffShow.html?id=' + json.id + '"></a>';
                }
                let html = `<div class="userziliao ">
						<div class="userDiv clearfix">
							<img src="` + json.head + `"
								class="img"/>
							<div class="descDiv">
								<div class="p clearfix">
									<span class="bale">昵称:</span>
									<span class="value">` + json.name + `</span>
								</div>
								<div class="p clearfix">
									<span class="bale">性别:</span>
									<span class="value">` + json.sex + `</span>
								</div>
								<div class="p icoArray clearfix">
									` + fun + `
								</div>
							</div>
						</div>
					</div>`;
                MC.msg.alert(html);
            });


        }


        /*** 带有输入框图片上传窗口 */
        export function Pic(fun: Function, tip: string = '未命名') {
            let html = $(`
							<div class="msgbody">
							<div class="msgBox">
							<div class="boxcon">请上传新的图片</div>
							<div class="picUpDiv">
								<div class="fileDiv">
									<input type="file">
								</div>
								<div class="inputdiv">
									<span class="name">请输入图片标题:</span>
									<label class="inputLabel">
										<input type="radio" name="tipDivradio" value="" style="display: none"/>
										
									</label>
									<input type="text" placeholder="新增图片" class="picname  mui-input-clear"/>
									<div class="tipDiv">
										<span class="tip">推荐图片标题</span>
										<ul class="ulselect clearfix"> 
										</ul>

									</div>

								</div>
							</div>

							<div class="butarray clearfix">
								<a class="button savebtn">确定</a>
								<a class="button closebtn buttonputong">关闭</a>
							</div>
							</div>
						</div>
					
					`);
            let files1 = html.find('.fileDiv [type=file]');
            let imgSrc = '';
            MC.API.bindFileUp(files1, (src: string) => {
                html.find('.fileDiv').css('background-image', 'url("' + src + '")');
                imgSrc = src;
            });

            /**
             *
             */
            if (tip !== '') {
                let tiplist = tip.split(',');
                for (let i = 0; i < tiplist.length; i++) {
                    let str = tiplist[i];
                    let li = `<li>
									<label>
										<input type="radio" name="tipDivradio" value="` + str + `"/>
										<span>` + str + `</span>
									</label>
								</li>`;
                    html.find('.tipDiv .ulselect').append(li);
                }
            } else {
                html.find('.tipDiv').hide();
            }
            html.find('.picname').on('click', () => {
                html.find('.inputLabel [name=tipDivradio]').click();
            });
            html.find('.inputdiv .ulselect li').on('click', function () {
                let str = $(this).find('[type=radio]').val();
                html.find('.picname').val(str);
            });


            html.find('.savebtn').click(() => {
                let name = html.find('.picname').val();
                if (name == '') {
                    msg.alert("图片标题必须填写");
                    return;
                }
                if (imgSrc == '') {
                    msg.alert("还未上传图片");
                    return;
                }
                fun({
                    src: imgSrc,
                    name: name
                });
                html.remove();
            });
            html.find('.closebtn').click(() => {
                html.remove();
            });
            $('body').append(html);
        }

        /**
         * 带有标签选择编辑的窗口
         */
        export function selsctTag(tagArray: string, fun: Function) {
            let html = $(`
				<div class="msgbody">
					<div class="msgBox">
						<div class="boxcon boxtitle">添加或者删除标签</div>
						<div class="tagDiv">
							<ul class="ul"> 
							</ul>
						</div>
						<div class="butarray clearfix">
							<a class="button savebtn">确定</a>
							<a class="button closebtn buttonputong">关闭</a>
						</div>
					</div>
				</div>
			
			`);

            let tArray = tagArray.split(',');
            for (let i = 0; i < tArray.length; i++) {
                let li = $(`<li class="clearfix">
									<span class="span">` + tArray[i] + `</span>
									<a class="deleteico"></a>
				</li>`);
                html.find('.tagDiv .ul').append(li);
            }

            html.on('click', '.tagDiv .ul li .deleteico', function () {
                let obj = $(this).parent();
                obj.remove();
            });

            let add = $(`<div class="addDiv clearfix">
									<input type="text" value="" class="text"/>
									<a class="button addspan">添加</a>
			</div>`);
            html.find('.tagDiv ').append(add);
            html.find('.addspan').on('click', () => {
                let text = html.find('.addDiv .text').val();
                if (text == '') {
                    msg.alert('必须输入内容');
                    return;
                }
                let obj = $('.msgbody .tagDiv .ul li .span');
                let list = [];
                for (let i = 0; i < obj.length; i++) {
                    list.push($(obj[i]).text());
                }
                if (list.indexOf(text) != -1) {
                    msg.alert('存在重复值');
                    return;
                }

                let li = $(`<li class="clearfix">
									<span class="span">` + text + `</span>
									<a class="deleteico"></a>
				</li>`);
                html.find('.tagDiv .ul').append(li);
                html.find('.addDiv .text').val('');
            });

            html.find('.savebtn').click(() => {
                let obj = $('.msgbody .tagDiv .ul li .span');
                let list = [];
                for (let i = 0; i < obj.length; i++) {
                    list.push($(obj[i]).text());
                }
                fun(list.join(','));
                html.remove();
            });
            html.find('.closebtn').click(() => {
                html.remove();
            });
            $('body').append(html);
        }


        /** 打开放大滑动图片 */
        export function Image(current: string, urls: Array<string> = []) {
            /**
             var obj = {
					urls : urls,
					current : current
				};
             previewImage.start(obj);
             */
            if (urls.indexOf(current) == -1) {
                urls.push(current);
            }

            current = MC.API.toBigPic(current);
            for (let i = 0; i < urls.length; i++) {
                urls[i] = MC.API.toBigPic(urls[i]);
            }
            previewImage.start({
                urls: urls,
                current: current
            });
        }


        export function showLoad() {
            if ($('.loadDiv_showLoad')[0]) {
                return;
            }
            let html = `<div class="loadDiv loadDiv_showLoad">
				<p class="loadp">加载中...</p>
			</div>`;
            $('body').append(html);
        }

        export function hideLoad() {
            $('.loadDiv_showLoad').remove();
        }


    }
}